<template>
  <div>
    <span>基本信息</span>
    <el-divider></el-divider>
    <div class="textBand">
      <el-row>
        <el-col :span="12"><div class="texts">商家名称:<span>{{customer}}</span></div></el-col>
        <el-col :span="12"><div class="texts">业务类型:<span>{{type}}</span></div></el-col>
        <el-col :span="12"><div class="texts">审核状态:<span>{{status}}</span></div></el-col>
        <el-col :span="12"><div class="texts">申请时间:<span>{{time}}</span></div></el-col>
        <el-col :span="24"><div class="texts">申请人:<span>{{petitioner}}</span></div></el-col>
        <el-col :span="24"><div class="texts">备注:<span>{{remark}}</span></div></el-col>
      </el-row>
      <div>
        <!-- 表单紧凑 -->
        <el-form  :model="params" ref="params" size="small" :inline="true"  class="demo-form-inline">
                <el-form-item label="销售订单号:" prop="orderCode">
                  <el-input v-model.trim="params.orderCode" placeholder="请输入"/>
                </el-form-item>
                <el-form-item label="采购合约号:" prop="contractCode" >
                  <el-input v-model.trim="params.contractCode" placeholder="请输入" />
                </el-form-item>
                <el-form-item label="客户:" prop="customerId">
                  <el-input v-model.trim="params.customerId" placeholder="请输入" />
                </el-form-item>
                <el-form-item label="供应商:" prop="supplyId">                   
                  <el-input v-model.trim="params.supplyId" placeholder="请输入" />
                </el-form-item>
                <el-form-item label="创建日期:" prop="createTime">
                  <el-input v-model.trim="params.createTime" placeholder="请输入" />
                </el-form-item>
                <el-form-item label="开单日期:" prop="orderTime">
                  <el-input v-model.trim="params.orderTime" placeholder="请输入" />
                </el-form-item>
                <el-form-item label="开单日期:" prop="orderTime">
                  <el-input v-model.trim="params.orderTime" placeholder="请输入" />
                </el-form-item>
                <el-form-item label="开单日期:" prop="orderTime">
                  <el-input v-model.trim="params.orderTime" placeholder="请输入" />
                </el-form-item>
        </el-form>
        <!-- <el-form label-width="120px" :model="params" ref="params" class="search-form" size="small">
            <el-row  type="flex" justify>
              <el-col :xs="24" :span="6">
                <el-form-item label="销售订单号:" prop="orderCode">
                  <el-input v-model.trim="params.orderCode" placeholder="请输入"></el-input>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :span="6">
                <el-form-item label="采购合约号:" prop="contractCode">
                  <el-input v-model.trim="params.contractCode" placeholder="请输入" />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :span="6">
                <el-form-item label="客户:" prop="customerId">
                  <el-input v-model.trim="params.customerId" placeholder="请输入" />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :span="6">
                <el-form-item label="供应商:" prop="supplyId">                   
                  <el-input v-model.trim="params.supplyId" placeholder="请输入" />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :span="6">
                <el-form-item label="创建日期:" prop="createTime">
                  <el-input v-model.trim="params.createTime" placeholder="请输入" />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :span="6">
                <el-form-item label="开单日期:" prop="orderTime">
                  <el-input v-model.trim="params.orderTime" placeholder="请输入" />
                </el-form-item>
              </el-col>
            </el-row>
        </el-form> -->
      </div>
    </div>
    <span>代理商资质信息</span>
    <div class="workflow">
      <!-- <bs-workflow-steps :space="230" :params="workflowConfig" :isPass="isPass"></bs-workflow-steps> -->
      <!-- <bs-workflow-logs max-height="230" :params="workflowConfig"></bs-workflow-logs> -->
      <!-- <bs-workflow-button :params="workflowConfig" @load="handleLoad"></bs-workflow-button> -->
      <bs-workflow :config="{ steps: true, logs: true, button: false }" :params="workflowConfig"></bs-workflow>
    </div>
    <span>商家数据</span>
    <el-divider></el-divider>
    <div>
      <el-row :gutter="20">
        <el-col :span="12">
          <span style="font-size:14px ;color: #575757">当前信息:</span>
          <el-row >
            <el-col :span="12">
              <div class="leftTable">
                是否欠费     
              </div>
            </el-col>
            <el-col :span="12">
              <div class="rightTable">
                否  
              </div>
            </el-col>
            <el-col :span="12">
              <div class="leftTable1">
                是否超期     
              </div>
            </el-col>
            <el-col :span="12">
              <div class="rightTable1">
                否  
              </div>
            </el-col>
            <el-col :span="12">
              <div class="leftTable2">
                是否超量     
              </div>
            </el-col>
            <el-col :span="12">
              <div class="rightTable2">
                否  
              </div>
            </el-col>
          </el-row>
        </el-col>
        <el-col :span="12">
          <span style="font-size:14px ;color: #575757">历史记录:(近12个月数据记录)</span>
          <el-row>
            <el-row>
              <el-col :span="12">
                <div class="leftTable">
                  是否存在超90日未开票记录     
                </div>
              </el-col>
              <el-col :span="12">
                <div class="rightTable">
                  无相关信息  
                </div>
              </el-col>
              <el-col :span="12">
                <div class="leftTable1">
                  欠票锁定次数     
                </div>
              </el-col>
              <el-col :span="12">
                <div class="rightTable1">
                  0  
                </div>
              </el-col>
              <el-col :span="12">
                <div class="leftTable2">
                  是否存在长期大额欠款记录     
                </div>
              </el-col>
              <el-col :span="12">
                <div class="rightTable2">
                  无相关信息  
                </div>
              </el-col>
            </el-row>
          </el-row>
        </el-col> 
        <el-form ref="form" :model="form" label-width="80px">
          <div class="item">
            <el-form-item label="审核意见:">
              <el-input type="textarea" v-model="form.desc" placeholder="不超过200个字"></el-input>
            </el-form-item>
          </div>
          <el-form-item>
            <div class="button">
              <el-row>
                <el-button type="success">审核通过</el-button>
                <el-button type="danger">审核驳回</el-button>
                <el-button>取消驳回</el-button>
              </el-row>
            </div>  
          </el-form-item>
      </el-form> 
      </el-row>
      <span>审核记录</span>
      <el-divider></el-divider>
    </div>
  </div>
</template>

<script>
import { getCookie } from '../../utils/storage'
export default {
  data(){
    return{
      value1:'',
      customer: '',
      type: '贸易商',
      status: '待商家销售总监审核',
      time: '2020-07-29',
      petitioner: '余欢',
      remark: '',
      isPass: null,
      workflowConfig: {
        platformId: 0,
        processDefKey: "risk_guarantee_apply", // erp_supplier_apply erp_presell_contract
        businessId: 195, // 372 2472
        adminId: getCookie("_eid_"),
      },
      form: {
          desc: ''
        },
      params: {
        orderCode: '',
        contractCode: '',
        customerId: '',
        datsupplyIde2: '',
        delivery: false,
        type: [],
        createTime: '',
        orderTime: '',

      }
    }
  },
   methods: {
    handleLoad(val) {
      this.isPass = val.data
      console.log("11111")
    },
  }

}
</script>

<style lang="scss" scoped>
.el-form-item__label{
  padding-right: 10px;
}
label{
  width: 0;
}
span{
  color: #848484;
  font-size: 16px;
}
.textBand{
  .texts{
    color: #525252;
    font-size: 14px;
    padding-bottom: 20px;
    padding-left: 220px;
    span{
      color: #525252;
      font-size: 14px;
      padding-left: 30px;
    }
  }
}
.leftTable, .leftTable1, .leftTable2{
    background-color: #eee;
    border-color: #dbdbdb;
    border-style: solid;
    border-width: 1px;
    padding: 8px;
    font-size: 14px;
    color: #575757;
    margin-top: 8px;
}
.leftTable1, .rightTable1{
  position: relative;
  top:-9px;
}
.leftTable2, .rightTable2{
  position: relative;
  top:-18px;
}
.rightTable, .rightTable1, .rightTable2{
    border-color: #dbdbdb;
    border-style: solid;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 0px;
    padding: 8px;
    font-size: 14px;
    color: #c22f2f;
    margin-top: 8px;
}
.workflow{
  padding-bottom: 30px;
  padding-top: 20px;
}
.button{
  text-align: center;
}
.item{
  width: 80%;
}
.el-input__inner{
  width: 20;
}
</style>